<%@ page language="java" pageEncoding="UTF-8"%>
<%@ taglib prefix="s" uri="/struts-tags" %>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>::中国联通无线宽带接入认证系统</title>
<link rel="stylesheet" type="text/css" href="css/user.css"/>
<link rel="stylesheet" type="text/css" href="css/pager.css"/>
<link rel="shortcut icon" href="images/chinaunicom.ico"/>

<script type="text/javascript" src="js/jquery-1.3.2.min.js"></script>
<script type="text/javascript" src="js/jquery.pager.js"></script>
<script type="text/javascript">
var bindIP = '${radiusUserVO.bindIP}';
var url = 'radAcct!listUserAcct.action?entity.username='+bindIP;

$(document).ready(function(){
	var pager = $('#pager').pager({
		limit:12,
		buttonClickCallback:function(start,pager){
			loadPage(start,pager);
		}
	});
	loadPage(0,pager);
	
});

function loadPage(start,pager){
	$.getJSON(url+'&start='+start+'&limit='+pager.limit+'&d='+new Date().getTime(),function(result){
		$('#resultBody tr[class=row]').remove();
		if(result.success){
			var _html = '';
			if(result.rows!=null){
				for(var i=0;i<result.rows.length;i++){
					var r = result.rows[i];
					_html +='<tr style="height:20px" class=row>';
					_html+='<td>'+(start+i+1)+'</td>';
					_html+='<td>'+r.acctStartTime+'</td>';
					_html+='<td>'+(r.acctStopTime==null?'<center>-</center>':r.acctStopTime)+'</td>';
					_html+='<td>'+r.acctSessionTime+'</td>';
					_html+='<td>'+Math.round(((r.acctInputOctets+r.acctOutputOctets)/1024))+'</td>';
					//_html+='<td>流量</td>';
					_html +='</tr>'
					
				}
				
			}
			$('#resultBody').append(_html);
			pager.setPageData({
				start:start,
				total:result.data
			});
		} else {
			var msg = '<font style="color:red">加载数据失败:</font>'+result.data;
			pager.setPageData({displayMsg:msg});
		}
	});
}
</script>
<style type="text/css">

 body {
 	background: url(images/welcome.jpg);
 	text-align: center;
 	width: 100%;
 	overflow-y:auto;
 }
 td{ background:white;border:#C4D8F1 solid 1px;}
 .label{
 	color:#0f86b2;
 	color:#c75f3e;
 }
 
#content,#foot{
	width:750px;
	margin:0 auto;
/* 	height:100%; */
	margin-top:10px;
}
#foot{
	bottom:0px;
	color:#aaa;
	height:50px;
	position:absolute;
	text-align: center;
	width:100%;
	left:0
}
.trbg{
 background:url(images/bg_th.gif) repeat-x;
}
</style>
</head>
<body>
<div id="header" style="height:40px;padding:10px 0 0 15px;text-align:left"><img src="images/ChinaUnicom.png"/></div>

<div id="content">
	<div id="userDetailGridDiv">
		<table style="border:1px solid #FFF;width:100%;">
			<caption>尊敬的 <span class="label">${radiusUserVO.username}</span> 用户,您已用流量 <span class="label">
			
			<s:text name="format.number"><s:param value="radiusUserVO.sumOctets/1024/1024"></s:param>
			</s:text> MB</span>,剩余流量 <span class="label"><s:text name="format.number">
			<s:param value="radiusUserVO.maxOctets-radiusUserVO.sumOctets/1024/1024"></s:param>
			</s:text> MB</span>,服务有效期至 <span class="label"><s:date name="radiusUserVO.expiredTime" format="yyyy年MM月dd日"/></span></caption>
			<thead>
				<tr class="trbg">
					<th style="width:60px"><center>序号</center></th><th style="width:150px"><center>开始时间</center></th>
					<th style="width:150px"><center>结束时间</center></th><th style="width:100px"><center>上网时长(秒)</center></th>
					<th style="width:100px"><center>上网流量(KB)</center></th>
				</tr>
			</thread>
			<tbody id="resultBody" ></tbody>
		</table>
		
		
	</div>
	<div id="pager"></div>
</div>
<!-- <div id="foot">中国联合通信有限公司 &nbsp;&nbsp;版权所有&copy;2012</div>  -->
</body>
</html>